import React, { Component } from 'react'
import axios from 'axios'
import {Type} from '../../types/main'

interface Iprops{
    match:any,
    history:any
}

interface IState{
    typelist:Type[]
}

export default class Varieties extends Component <Iprops,IState>{
    state = {
        typelist:[]
    }
    componentDidMount(){
        let pet_breed = this.props.match.params.pet_breed;
        axios.get('/api/breed',{data:{pet_breed}}).then(res => {
            console.log(res.data.data)
            this.setState({
                typelist:res.data.data
            })
        })
    }
    render() {
        let {typelist} = this.state;
        return (
            <div>
                <ul>
                    {typelist && typelist.map((item:Type) => <li onClick={() => {
                        this.props.history.push({pathname:'/public',state:{spe_name:item.spe_name}})
                    }} key={item.spe_id}>{item.spe_name}</li>)}
                </ul>
            </div>
        )
    }
}
